<!DOCTYPE html>
<head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=0">
    <title>GoodERP</title>
    <link rel="stylesheet" href="/mobile/static/src/css/weui.css" />
    <link rel="stylesheet" href="/mobile/static/src/css/index.css" />
</head>
<body ontouchstart>
    <div id="container" class="container" @scroll.self="scroll_container">
        <div id="home" style="display: none">
            <div class="hd">
                <h1 class="page_title">GoodERP</h1>
            </div>
            <div class="bd">
                <div class="weui_grids">
                    <% for menu in menus %>
                    <a data-display="${menu.display_name}" href="#/${ menu.name }${menu.using_wizard and '-using_wizard' or ''}" class="weui_grid">
                        <div class="weui_grid_icon icon_default">
                            <i class="${ menu.icon_class }"></i>
                        </div>
                        <p class="weui_grid_label">
                            ${ menu.display_name }
                        </p>
                    </a>
                    <% endfor %>
                </div>
            </div>
        </div>
        <div id="tree" style="display: none">
            <div id="tree_content" v-if="!wizard">
                <div class="hd">
                    <h1 class="page_title">{{ display_name }}</h1>
                </div>
                <div class="weui_cells weui_cells_form gooderp_search">
                    <div class="weui_cell gooderp_search">
                        <span class="gooderp_search_filter" v-for="filter in search_filter">
                            {{ filter.string }} {{ filter.operator || ':' }} {{ filter.word }}
                            <a class="gooderp_filter_cancel_search" @click="cancel_filter($index)">x</a>
                        </span>
                        <div class="weui_cell_bd weui_cell_primary">
                            <input @focus="focus_search" @blur="blur_search" @keydown.delete.esc="esc_search" @keydown.enter="enter_search" class="weui_input" v-model="search_word" type="text" placeholder="{{ display_name }}搜索框">
                        </div>
                    </div>
                    <a v-show="search_word || search_filter.length > 0" class="gooderp_cancel_search" @click="cancel_search"></a>
                    <div class="weui_cells weui_cells_access gooderp_search_results" v-show="search_word" transition="gooderp_fade">
                        <a v-for="view in search_view" @click="add_search(view)" class="weui_cell" href="javascript:;">
                            <div class="weui_cell_bd weui_cell_primary">
                                <p>搜索{{view.string}}：{{ search_word }}</p>
                            </div>
                            <div @click.self.stop="choose_operator(view)" v-show="['integer', 'float'].indexOf(view.column) >= 0" class="gooderp_search_operator">{{ map_operator(view.operator) }}</div>
                            <div class="weui_cell_ft">
                            </div>
                        </a>
                    </div>
                </div>
                <div class="gooderp_tree weui_cells">
                    <div class="weui_cell gooderp_tree_header" >
                        <div class="weui_cell_bd weui_cell_primary" :class="[order_direction, {gooderp_tree_order_current: order_name == headers.left.name}]" @click.self="order_by($event, headers.left)">
                            {{ headers.left.string }}
                            <div class="gooderp_tree_order">
                                <span class="gooderp_tree_order_up" ></span>
                                <span class="gooderp_tree_order_down" ></span>
                            </div>
                        </div>
                        <div class="weui_cell_bd weui_cell_primary" :class="[order_direction, {gooderp_tree_order_current: order_name == headers.center.name}]" @click.self="order_by($event, headers.center)">
                            {{ headers.center.string }}
                            <div class="gooderp_tree_order">
                                <span class="gooderp_tree_order_up" ></span>
                                <span class="gooderp_tree_order_down" ></span>
                            </div>
                        </div>
                        <div class="weui_cell_bd weui_cell_primary" :class="[order_direction, {gooderp_tree_order_current: order_name == headers.right.name}]" @click.self="order_by($event, headers.right)">
                            {{ headers.right.string }}
                            <div class="gooderp_tree_order">
                                <span class="gooderp_tree_order_up" ></span>
                                <span class="gooderp_tree_order_down" ></span>
                            </div>
                        </div>
                    </div>
                    <template v-for="record in records">
                        <div class="weui_cell gooderp_tree_row" track-by="id" >
                            <div class="weui_cell_bd weui_cell_primary {{ compute_class(headers.left) }}">{{{ compute_widget(headers.left, record.left) }}}</div>
                            <div class="weui_cell_bd weui_cell_primary {{ compute_class(headers.center) }}">{{{ compute_widget(headers.center, record.center) }}}</div>
                            <div class="weui_cell_bd weui_cell_primary {{ compute_class(headers.right) }}">{{{ compute_widget(headers.right, record.right) }}}</div>
                            <a class="gooderp_more" :class="{choosed: record_form === record.id}" @click.prevent.stop.self="open_form(record.id)"></a>
                        </div>
                        <div v-if="record_form === record.id" class="gooderp_form weui_cells" transition="gooderp_fade">
                            <div class="weui_cell" v-for="form_record in form_records" v-if="form_record.name != 'id'">
                                <div class="weui_cell_bd weui_cell_primary">
                                    <p>{{{ compute_form_header(form_record) }}}</p>
                                </div>
                                <div class="weui_cell_ft">{{{ compute_form_widget(form_record) }}}</div>
                            </div>
                        </div>
                    </template>
                    <div class="weui_cell gooderp_tree_footer" >
                        <div class="weui_cell_bd weui_cell_primary" >
                            {{ footers.left }}
                        </div>
                        <div class="weui_cell_bd weui_cell_primary" >
                            {{ footers.center }}
                        </div>
                        <div class="weui_cell_bd weui_cell_primary" >
                            {{ footers.right }}
                        </div>
                    </div>
                </div>

                <div class="weui_dialog_confirm" id="dialog1" style="display: none;">
                    <div class="weui_mask"></div>
                    <div class="gooderp_operator_dialog weui_dialog">
                        <div class="weui_cells weui_cells_access">
                            <div class="weui_cell" data-operator=">">
                                <div class="weui_cell_bd weui_cell_primary">大于</div>
                            </div>
                            <div class="weui_cell" data-operator="<">
                                <div class="weui_cell_bd weui_cell_primary">小与</div>
                            </div>
                            <div class="weui_cell" data-operator=">=">
                                <div class="weui_cell_bd weui_cell_primary">大于等于</div>
                            </div>
                            <div class="weui_cell" data-operator="<=">
                                <div class="weui_cell_bd weui_cell_primary">小与等于</div>
                            </div>
                            <div class="weui_cell" data-operator="=">
                                <div class="weui_cell_bd weui_cell_primary">等于</div>
                            </div>
                            <div class="weui_cell" data-operator="!=">
                                <div class="weui_cell_bd weui_cell_primary">不等于</div>
                            </div>
                        </div>

                        <div class="weui_dialog_ft">
                            <a href="javascript:;" class="weui_btn_dialog default">取消</a>
                        </div>
                    </div>
                </div>
                <div class="gooderp_progress weui_progress">
                    <div class="weui_progress_bar">
                        <div class="weui_progress_inner_bar js_progress" style="width: 0"></div>
                    </div>
                </div>
            </div>
            <div id="tree_wizard" v-if="wizard">
                <div class="gooderp_wizard weui_dialog_confirm" :class="{display_message: editable}">
                    <div class="weui_mask"></div>
                    <div class="weui_dialog">
                        <div  class="weui_cells" transition="gooderp_fade">
                            <div class="weui_cell" :class="{required: wizard_record.required}" v-for="wizard_record in wizard_records" >
                                <div class="weui_cell_hd"><label class="weui_label">{{ wizard_record.string }}</label></div>
                                <div class="weui_cell_bd weui_cell_primary">
                                    <component :model.sync="wizard_record" :is="wizard_record.type + '-input'">
                                    </component>
                                    <div class="gooderp_wizard_message" :class="{show: wizard_record.required && !wizard_record.value}">必输</div>
                                </div>
                            </div>
                        </div>
                        <div class="weui_dialog_ft">
                            <a class="weui_btn_dialog default" @click.stop="cancel_wizard">取消</a>
                            <a class="weui_btn_dialog primary" @click.stop="confirm_wizard">确定</a>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="gooderp_max_count"><span>{{ records.length }}</span>|<span>{{ max_count }}</span></div>
        <template id="many2oneInput">
            <input @blur="blur_input" @keydown.esc.delete="delete_input" @keydown.enter="enter_input" class="weui_input" v-model="word" type="text" :placeholder="model.placeholder" @input="input_change" />
            <div class="weui_cells gooderp_many2oneInput gooderp_search_results" v-show="search_word" transition="gooderp_fade">
                <div v-for="record in records" @click.stop.prevent="choose_record(record)" class="weui_cell" href="javascript:;">
                    {{record.value}}
                </div>
            </div>
        </template>
        <template id="selectionInput">
            <select class="weui_select" v-model="model.value" >
                <option v-for="select in selection" :value="select[0]">{{select[1]}}</option>
            </select>
        </template>
    </div>
    <script src="/mobile/static/src/js/jquery.js" ></script>
    <script src="/mobile/static/src/js/component.js" ></script>
    <script src="/mobile/static/src/js/vue.js" ></script>
    <script src="/mobile/static/src/js/index.js"></script>
</body>
